<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>Meteo Cal - Search Users</title>
    </h:head>
    <h:body>
        <p:layout style="min-width:1000px;min-height:1000px;">
            <p:layoutUnit position="west" resizable="true" size="220" minSize="80" maxSize="300">
                    <h:form id="button">
                        <br></br>
                        <p:commandButton id="viewPersonal" value="Personal Page" action="#{searchUserBean.uploadPersonalPage()}" ajax="true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">  
                        </p:commandButton>
                        <br></br><br></br>
                        <p:commandButton id="newEvent" value="New Event" action="new-event" ajax="true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">
                        </p:commandButton>
                        <br></br><br></br>
                        <p:commandButton id="searchUser" value="Browse User" action="#{searchBean.browseUsers()}" ajax="true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">
                        </p:commandButton>
                        <br></br><br></br>
                        <p:commandButton id="searchEvent" value="Search Event" action="search-event-page" ajax="true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">  
                        </p:commandButton>
                        <br></br><br></br>
                        <p:commandButton id="logout" value="Logout" action="#{loginBean.logout()}" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">
                        </p:commandButton>
                        <br></br><br></br>
                        <p:commandButton id="mainPage" value="Main Page" action="main-page?faces-redirect=true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">
                        </p:commandButton>
                        </h:form>
                </p:layoutUnit>
            
            <p:layoutUnit position="center" resizable="true" size="700" minSize="100" maxSize="600">
                <h:form id="searchPage">
                    <div align="center">
                    <div>
                        <p:inputText id="keywordUsername" value="#{searchBean.keywordUsername}">
                        <p:watermark for="keywordUsername" value="Search by username" id="watermarkU" />
                        </p:inputText>
                        <p:commandButton id="searchUsername" value="Search" action="#{searchBean.searchUsername()}" update="user_list" />
                    </div>
                    <br></br>
                    <div>
                       <p:inputText id="keywordName" value="#{searchBean.keywordName}">
                       <p:watermark for="keywordName" value="Search by Name" id="watermarkN" />
                       </p:inputText>
                       <p:commandButton id="searchName" value="Search" action="#{searchBean.searchName()}" update="user_list" />

                   </div>
                   <br></br>
                    <div>
                        <p:inputText id="keywordCity" value="#{searchBean.keywordCity}">
                        <p:watermark for="keywordCity" value="Search by Location" id="watermarkC" />
                        </p:inputText>
                        <p:commandButton id="searchCity" value="Search" action="#{searchBean.searchCity()}" update="user_list" />

                    </div>
                   <br></br>
                   </div>
                    <p:dataList id="user_list" value="#{searchBean.currentUserList}" var="user" itemType="disc" type="ordered">
                        <p:commandLink id="link_pp" update=":searchPage:" ajax="true" value="#{user.username}" action="#{searchUserBean.uploadUserPersonalPage()}">
                            <f:setPropertyActionListener value="#{user}" target="#{searchUserBean.selectedUser}" />
                        </p:commandLink> 
                        <br></br>#{user.name}, #{user.city} 
                        <br></br>
                        <p:commandLink id="link_addCalendar" update=":searchPage:" disabled="#{! user.privacyLevel}" ajax="true" value="Add to calendar" action="#{showCalendarBean.addUserCalendar()}">
                            <f:setPropertyActionListener value="#{user.username}" target="#{showCalendarBean.addingUser}" /> 
                        </p:commandLink>
                        <br></br>
                        <p:commandLink id="link_removeCalendar" update=":searchPage:" disabled="#{! user.privacyLevel}" ajax="true" value="Remove from calendar" action="#{showCalendarBean.removeUserCalendar()}">
                            <f:setPropertyActionListener value="#{user.username}" target="#{showCalendarBean.removingUser}" /> 
                        </p:commandLink>
                        <br></br><br></br><br></br>
                    </p:dataList>  
                </h:form>
        </p:layoutUnit>
        </p:layout>
    </h:body>
</html>
